<template>
  <div align="center">
    <div>
      <h1>添加新闻</h1>
      <p>新闻标题：<input type="text" v-model="form.title"></p>
      <p>新闻内容：<input type="text" v-model="form.content"></p>
      <button @click="add_news">添加</button>
    </div>
    <div>

      <table border="1" cellspacing="0">
        <tr>
          <td>标题</td>
          <td>内容</td>
        </tr>
        <tr v-for="i in news">
          <td>{{ i.title }}</td>
          <td>{{ i.content }}</td>
        </tr>

      </table>
      <button v-for="i in tpage" @click="get_news(i)">{{ i }}</button>
    </div>
  </div>
</template>

<script>
export default {
  name: "add_news",
  data() {
    return {
      form: {},
      news: [],
      tpage: 0

    }
  },
  methods: {
    add_news() {
      this.$axios.post('news/', this.form)
        .then(res => {
          if (res.data.code == 200) {
            alert('添加成功')
            console.log(res.data)
            this.form = {}
          }
        })
    },

    get_news(i) {
      this.$axios.get('news/?cpage=' + i)
        .then(res => {
          if (res.data.code == 200) {
            this.news = res.data.list
            this.tpage = res.data.tpage
          }
        })
    },
  },
  mounted() {
    this.get_news(1)
  }


}
</script>

<style scoped>

</style>
